<template>
    <view class="page flex-col">
        
        <view class="group_2 flex-col">
            <view class="box_3 flex-row justify-between">
                <view class="image-text_8 flex-row justify-between">
                    <image class="image_4" referrerpolicy="no-referrer"
                        src="https://lanhu-oss-proxy.lanhuapp.com/SketchPngef7000773f936655753e92715cad99246980806444992c3ad2689bda51983fff" />
                    <view class="text-group_8 flex-col">
                        <text class="text_3">麦田蛋挞</text>
                        <text class="text_4">30岁·女</text>
                    </view>
                </view>
                <view class="text-wrapper_1 flex-col">
                    <text class="text_5" @click="handleEdit">编辑</text>
                </view>
            </view>
            <view class="box_4 flex-row">
                <image class="thumbnail_9" referrerpolicy="no-referrer"
                    src="https://lanhu-oss-proxy.lanhuapp.com/SketchPng7a60532d6b09a1280a499a67800df2ad487cb2e1bb6acb1c0316e082c5f71bd9" />
                <text class="text_6">实名</text>
                <image class="thumbnail_10" referrerpolicy="no-referrer"
                    src="https://lanhu-oss-proxy.lanhuapp.com/SketchPngeadd91e8e11fc21b08195f75f70a574241695ae8ad4cfc66595d2c166f06430d" />
                <text class="text_7">工作</text>
            </view>
            <view class="section_3 flex-col"></view>
            <view class="image-text_9 flex-row justify-between">
                <image class="label_6" referrerpolicy="no-referrer"
                    src="https://lanhu-oss-proxy.lanhuapp.com/SketchPng385f52509c86ca7ed5c2f69eccb2fe37e8ac096b43b9932f87d09219a461a029" />
                <text class="text-group_2">生活近照</text>
            </view>
            <view class="image-wrapper_2 flex-row">
                <image class="image_5" referrerpolicy="no-referrer" :src="item.lanhuimage0"
                    v-for="(item, index) in loopData0" :key="index" />
            </view>
            <view class="image-text_10 flex-row justify-between">
                <image class="label_7" referrerpolicy="no-referrer"
                    src="https://lanhu-oss-proxy.lanhuapp.com/SketchPng2e129f0df86a4812ec033937fd58ad365abae3b3ad641e37b6e6971e945ea8e0" />
                <text class="text-group_3">个性身份</text>
            </view>
            <view class="box_5 flex-row justify-between">
                <view class="text-wrapper_12 flex-col">
                    <text class="text_29">🦉夜猫子</text>
                </view>
                <view class="text-wrapper_13 flex-col">
                    <text class="text_30">💻打工人</text>
                </view>
            </view>
            <view class="image-text_11 flex-row justify-between">
                <image class="label_8" referrerpolicy="no-referrer"
                    src="https://lanhu-oss-proxy.lanhuapp.com/SketchPng240e59e655a5b7fd4b68f38bb4caa9918d7360a357c361270ca07c5eb048223b" />
                <text class="text-group_4">兴趣爱好</text>
            </view>
            <view class="box_6 flex-row justify-between">
                <view class="text-wrapper_14 flex-col">
                    <text class="text_31">⛰️户外</text>
                </view>
                <view class="text-wrapper_15 flex-col">
                    <text class="text_32">🚴🏻骑行</text>
                </view>
            </view>
            <view class="image-text_12 flex-row justify-between">
                <image class="label_9" referrerpolicy="no-referrer"
                    src="https://lanhu-oss-proxy.lanhuapp.com/SketchPng0564ac0b88bfb95420b9006f5a813fc9491809d646718875221bd5f609d74122" />
                <text class="text-group_5">我爱去</text>
            </view>
            <view class="box_7 flex-row justify-between">
                <view class="text-wrapper_16 flex-col">
                    <text class="text_33">🎙️话剧脱口秀</text>
                </view>
                <view class="text-wrapper_17 flex-col">
                    <text class="text_34">⛺️野餐露营</text>
                </view>
            </view>
        </view>
        <view class="group_3 flex-col">
            <view class="box_8 flex-row justify-between">
                <image class="label_10" referrerpolicy="no-referrer"
                    src="https://lanhu-oss-proxy.lanhuapp.com/SketchPng34681c427a5b20aea5b68ade0d86cf5bcb97af9def5331e20b9189b77e01dc3a" />
                <text class="text_14">认证信息</text>
            </view>
            <text class="text_15">·&nbsp;公开信息（在个人信息中公开）</text>
            <view class="text-wrapper_18 flex-row justify-between">
                <text class="text_16">性别</text>
                <text class="text_17">女</text>
            </view>
            <view class="text-wrapper_19 flex-row justify-between">
                <text class="text_18">年龄</text>
                <text class="text_19">24</text>
            </view>
            <view class="section_8 flex-col"></view>
            <text class="text_20">
                ·&nbsp;私密信息（仅用于实名认证，进行严格加密储存）
            </text>
            <view class="text-wrapper_20 flex-row justify-between">
                <text class="text_21">姓名</text>
                <text class="text_22">李*三</text>
            </view>
            <view class="text-wrapper_21 flex-row justify-between">
                <text class="text_23">年龄</text>
                <text class="text_24">420**********6930</text>
            </view>
            <view class="section_9 flex-col"></view>
            <view class="box_9 flex-row justify-between">
                <view class="image-text_13 flex-row justify-between">
                    <image class="thumbnail_11" referrerpolicy="no-referrer"
                        src="https://lanhu-oss-proxy.lanhuapp.com/SketchPngeadd91e8e11fc21b08195f75f70a574241695ae8ad4cfc66595d2c166f06430d" />
                    <text class="text-group_6">工作认证</text>
                </view>
                <text class="text_25">已认证</text>
            </view>
            <view class="box_10 flex-row justify-between">
                <view class="image-text_14 flex-row justify-between">
                    <image class="thumbnail_12" referrerpolicy="no-referrer"
                        src="https://lanhu-oss-proxy.lanhuapp.com/SketchPngbd6b790a240bee42fb9dfdee465b8d0e8bdb93df9a29d61aef19ca6501b92712" />
                    <text class="text-group_7">婚姻状态认证</text>
                </view>
                <text class="text_26">未婚</text>
            </view>
        </view>
    </view>
</template>
<script>
export default {
    data() {
        return {
            loopData0: [
                {
                    lanhuimage0:
                        'https://lanhu-oss-proxy.lanhuapp.com/SketchPng82e2b9a1ee0a3f18883301b2e712f612371b6cc7aadda5587a56ebc9095918a1',
                },
                {
                    lanhuimage0:
                        'https://lanhu-oss-proxy.lanhuapp.com/SketchPng6a120328b2edb8b48a4c48ede67b7c43a0ab3918aefe8eb4447d4df375a31d5d',
                },
                {
                    lanhuimage0:
                        'https://lanhu-oss-proxy.lanhuapp.com/SketchPngbb16203a3580415b44cc58243e81e117782be94bba6de7aa1f4b18acdd63ed31',
                },
            ],
            constants: {},
        };
    },
    methods: {
        handleEdit() {
            uni.navigateTo({
                url: '/subpage/meethuangshi/editPersonalPage'
            });
        }
    },
};
</script>
<style lang="scss" scoped>
@import '../../static/style/common.css';

.page {
    background-color: rgba(247, 246, 255, 1);
    position: relative;
    width: 390px;
    height: 1000px;
    overflow: hidden;
    padding-left: 0;
    padding-right: 0;
    padding-top: 0;
    padding-bottom: 25px;

    .block_1 {
        padding: 18px 6px 16px 6px;

        .section_12 {
            margin: 0 27px 0 37px;

            .text_27 {
                overflow-wrap: break-word;
                color: rgba(0, 0, 0, 1);
                font-size: 17px;
                font-family: SFPro-Semibold;
                font-weight: 600;
                text-align: right;
                white-space: nowrap;
                line-height: 22px;
            }

            .thumbnail_7 {
                width: 19px;
                height: 12px;
                margin: 5px 0 5px 182px;
            }

            .thumbnail_8 {
                width: 17px;
                height: 12px;
                margin: 5px 0 5px 8px;
            }

            .image_6 {
                width: 27px;
                height: 13px;
                margin: 5px 0 4px 7px;
            }
        }

        .section_13 {
            width: 378px;
            margin-top: 13px;

            .image_2 {
                width: 87px;
                height: 32px;
            }

            .text_28 {
                height: 24px;
                overflow-wrap: break-word;
                color: rgba(0, 0, 0, 1);
                font-size: 17px;
                font-family: SFProDisplay-Medium;
                font-weight: 500;
                text-align: right;
                white-space: nowrap;
                line-height: 20px;
                margin-top: 4px;
            }

            .image_3 {
                width: 87px;
                height: 32px;
            }
        }
    }

    .group_2 {
        background-color: rgba(255, 255, 255, 1);
        border-radius: 40px 20px 20px 20px;
        width: 358px;
        align-self: center;
        margin-top: -1px;
        padding: 8px 0 16px 12px;

        .box_3 {
            width: 334px;
            margin-right: 12px;

            .image-text_8 {
                width: 136px;

                .image_4 {
                    width: 56px;
                    height: 56px;
                }

                .text-group_8 {
                    margin: 6px 0 4px 0;

                    .text_3 {
                        overflow-wrap: break-word;
                        color: rgba(52, 49, 79, 1);
                        font-size: 16px;
                        font-family: PingFangSC-Medium;
                        font-weight: 500;
                        text-align: left;
                        white-space: nowrap;
                        line-height: 22px;
                    }

                    .text_4 {
                        overflow-wrap: break-word;
                        color: rgba(52, 49, 79, 1);
                        font-size: 14px;
                        font-weight: normal;
                        text-align: left;
                        white-space: nowrap;
                        line-height: 20px;
                        margin: 4px 12px 0 0;
                    }
                }
            }

            .text-wrapper_1 {
                background-color: rgba(52, 49, 79, 0.08);
                border-radius: 12px;
                border: 1px solid rgba(255, 255, 255, 0.3);
                margin: 4px 0 28px 0;
                padding: 3px 23px 3px 23px;

                .text_5 {
                    overflow-wrap: break-word;
                    color: rgba(52, 49, 79, 1);
                    font-size: 12px;
                    font-weight: normal;
                    text-align: right;
                    white-space: nowrap;
                    line-height: 16px;
                }
            }
        }

        .box_4 {
            margin: 0 182px 0 70px;

            .thumbnail_9 {
                width: 16px;
                height: 16px;
            }

            .text_6 {
                overflow-wrap: break-word;
                color: rgba(52, 49, 79, 1);
                font-size: 12px;
                font-weight: normal;
                text-align: left;
                white-space: nowrap;
                line-height: 16px;
                margin-left: 2px;
            }

            .thumbnail_10 {
                width: 16px;
                height: 16px;
                margin-left: 10px;
            }

            .text_7 {
                overflow-wrap: break-word;
                color: rgba(52, 49, 79, 1);
                font-size: 12px;
                font-weight: normal;
                text-align: left;
                white-space: nowrap;
                line-height: 16px;
                margin-left: 2px;
            }
        }

        .section_3 {
            background-color: rgba(52, 49, 79, 0.08);
            width: 342px;
            height: 1px;
            margin: 12px 0 0 4px;
        }

        .image-text_9 {
            width: 94px;
            margin: 16px 248px 0 4px;

            .label_6 {
                width: 24px;
                height: 24px;
            }

            .text-group_2 {
                overflow-wrap: break-word;
                color: rgba(52, 49, 79, 1);
                font-size: 16px;
                font-family: PingFangSC-Medium;
                font-weight: 500;
                text-align: left;
                white-space: nowrap;
                line-height: 22px;
                margin-top: 1px;
            }
        }

        .image-wrapper_2 {
            width: 243px;
            height: 76px;
            margin: 8px 99px 0 4px;

            .image_5 {
                width: 76px;
                height: 76px;
                margin-right: 7px;
            }
        }

        .image-text_10 {
            width: 94px;
            margin: 16px 248px 0 4px;

            .label_7 {
                width: 24px;
                height: 24px;
            }

            .text-group_3 {
                overflow-wrap: break-word;
                color: rgba(52, 49, 79, 1);
                font-size: 16px;
                font-family: PingFangSC-Medium;
                font-weight: 500;
                text-align: left;
                white-space: nowrap;
                line-height: 22px;
                margin-top: 1px;
            }
        }

        .box_5 {
            width: 178px;
            margin: 8px 164px 0 4px;

            .text-wrapper_12 {
                background-color: rgba(52, 49, 79, 0.06);
                border-radius: 14px;
                padding: 8px 12px 8px 12px;

                .text_29 {
                    overflow-wrap: break-word;
                    color: rgba(52, 49, 79, 1);
                    font-size: 14px;
                    font-weight: normal;
                    text-align: left;
                    white-space: nowrap;
                    line-height: 20px;
                }
            }

            .text-wrapper_13 {
                background-color: rgba(52, 49, 79, 0.06);
                border-radius: 14px;
                padding: 8px 12px 8px 12px;

                .text_30 {
                    overflow-wrap: break-word;
                    color: rgba(52, 49, 79, 1);
                    font-size: 14px;
                    font-weight: normal;
                    text-align: left;
                    white-space: nowrap;
                    line-height: 20px;
                }
            }
        }

        .image-text_11 {
            width: 94px;
            margin: 16px 248px 0 4px;

            .label_8 {
                width: 24px;
                height: 24px;
            }

            .text-group_4 {
                overflow-wrap: break-word;
                color: rgba(52, 49, 79, 1);
                font-size: 16px;
                font-family: PingFangSC-Medium;
                font-weight: 500;
                text-align: left;
                white-space: nowrap;
                line-height: 22px;
                margin-top: 1px;
            }
        }

        .box_6 {
            width: 164px;
            margin: 8px 178px 0 4px;

            .text-wrapper_14 {
                background-color: rgba(52, 49, 79, 0.06);
                border-radius: 14px;
                padding: 8px 12px 8px 12px;

                .text_31 {
                    overflow-wrap: break-word;
                    color: rgba(52, 49, 79, 1);
                    font-size: 14px;
                    font-weight: normal;
                    text-align: left;
                    white-space: nowrap;
                    line-height: 20px;
                }
            }

            .text-wrapper_15 {
                background-color: rgba(52, 49, 79, 0.06);
                border-radius: 14px;
                padding: 8px 12px 8px 12px;

                .text_32 {
                    overflow-wrap: break-word;
                    color: rgba(52, 49, 79, 1);
                    font-size: 14px;
                    font-weight: normal;
                    text-align: left;
                    white-space: nowrap;
                    line-height: 20px;
                }
            }
        }

        .image-text_12 {
            width: 78px;
            margin: 16px 264px 0 4px;

            .label_9 {
                width: 24px;
                height: 24px;
            }

            .text-group_5 {
                overflow-wrap: break-word;
                color: rgba(52, 49, 79, 1);
                font-size: 16px;
                font-family: PingFangSC-Medium;
                font-weight: 500;
                text-align: left;
                white-space: nowrap;
                line-height: 22px;
                margin-top: 1px;
            }
        }

        .box_7 {
            width: 220px;
            margin: 8px 122px 0 4px;

            .text-wrapper_16 {
                background-color: rgba(52, 49, 79, 0.06);
                border-radius: 14px;
                padding: 8px 12px 8px 12px;

                .text_33 {
                    overflow-wrap: break-word;
                    color: rgba(52, 49, 79, 1);
                    font-size: 14px;
                    font-weight: normal;
                    text-align: left;
                    white-space: nowrap;
                    line-height: 20px;
                }
            }

            .text-wrapper_17 {
                background-color: rgba(52, 49, 79, 0.06);
                border-radius: 14px;
                padding: 8px 12px 8px 12px;

                .text_34 {
                    overflow-wrap: break-word;
                    color: rgba(52, 49, 79, 1);
                    font-size: 14px;
                    font-weight: normal;
                    text-align: left;
                    white-space: nowrap;
                    line-height: 20px;
                }
            }
        }
    }

    .group_3 {
        background-color: rgba(255, 255, 255, 1);
        border-radius: 20px;
        width: 358px;
        align-self: center;
        margin-top: 12px;
        padding: 14px 0 17px 16px;

        .box_8 {
            width: 94px;
            margin-right: 248px;

            .label_10 {
                width: 24px;
                height: 24px;
            }

            .text_14 {
                overflow-wrap: break-word;
                color: rgba(52, 49, 79, 1);
                font-size: 16px;
                font-family: PingFangSC-Medium;
                font-weight: 500;
                text-align: left;
                white-space: nowrap;
                line-height: 22px;
                margin-top: 1px;
            }
        }

        .text_15 {
            overflow-wrap: break-word;
            color: rgba(52, 49, 79, 1);
            font-size: 12px;
            font-weight: normal;
            text-align: left;
            white-space: nowrap;
            line-height: 16px;
            margin: 18px 164px 0 0;
        }

        .text-wrapper_18 {
            width: 326px;
            margin: 16px 16px 0 0;

            .text_16 {
                overflow-wrap: break-word;
                color: rgba(52, 49, 79, 1);
                font-size: 14px;
                font-family: PingFangSC-Medium;
                font-weight: 500;
                text-align: left;
                white-space: nowrap;
                line-height: 20px;
            }

            .text_17 {
                overflow-wrap: break-word;
                color: rgba(52, 49, 79, 1);
                font-size: 14px;
                font-weight: normal;
                text-align: left;
                white-space: nowrap;
                line-height: 20px;
            }
        }

        .text-wrapper_19 {
            width: 326px;
            margin: 20px 16px 0 0;

            .text_18 {
                overflow-wrap: break-word;
                color: rgba(52, 49, 79, 1);
                font-size: 14px;
                font-family: PingFangSC-Medium;
                font-weight: 500;
                text-align: left;
                white-space: nowrap;
                line-height: 20px;
            }

            .text_19 {
                overflow-wrap: break-word;
                color: rgba(52, 49, 79, 1);
                font-size: 14px;
                font-weight: normal;
                text-align: left;
                white-space: nowrap;
                line-height: 20px;
            }
        }

        .section_8 {
            background-color: rgba(52, 49, 79, 0.08);
            width: 342px;
            height: 1px;
            margin-top: 9px;
        }

        .text_20 {
            overflow-wrap: break-word;
            color: rgba(52, 49, 79, 1);
            font-size: 12px;
            font-weight: normal;
            text-align: left;
            white-space: nowrap;
            line-height: 16px;
            margin: 18px 68px 0 0;
        }

        .text-wrapper_20 {
            width: 326px;
            margin: 16px 16px 0 0;

            .text_21 {
                overflow-wrap: break-word;
                color: rgba(52, 49, 79, 1);
                font-size: 14px;
                font-family: PingFangSC-Medium;
                font-weight: 500;
                text-align: left;
                white-space: nowrap;
                line-height: 20px;
            }

            .text_22 {
                overflow-wrap: break-word;
                color: rgba(52, 49, 79, 1);
                font-size: 14px;
                font-weight: normal;
                text-align: left;
                white-space: nowrap;
                line-height: 20px;
            }
        }

        .text-wrapper_21 {
            width: 326px;
            margin: 20px 16px 0 0;

            .text_23 {
                overflow-wrap: break-word;
                color: rgba(52, 49, 79, 1);
                font-size: 14px;
                font-family: PingFangSC-Medium;
                font-weight: 500;
                text-align: left;
                white-space: nowrap;
                line-height: 20px;
            }

            .text_24 {
                overflow-wrap: break-word;
                color: rgba(52, 49, 79, 1);
                font-size: 14px;
                font-weight: normal;
                text-align: left;
                white-space: nowrap;
                line-height: 20px;
            }
        }

        .section_9 {
            background-color: rgba(52, 49, 79, 0.08);
            width: 342px;
            height: 1px;
            margin-top: 9px;
        }

        .box_9 {
            width: 326px;
            margin: 19px 16px 0 0;

            .image-text_13 {
                width: 88px;

                .thumbnail_11 {
                    width: 16px;
                    height: 16px;
                    margin: 3px 0 3px 0;
                }

                .text-group_6 {
                    overflow-wrap: break-word;
                    color: rgba(52, 49, 79, 1);
                    font-size: 16px;
                    font-family: PingFangSC-Medium;
                    font-weight: 500;
                    text-align: left;
                    white-space: nowrap;
                    line-height: 22px;
                }
            }

            .text_25 {
                overflow-wrap: break-word;
                color: rgba(52, 49, 79, 1);
                font-size: 14px;
                font-weight: normal;
                text-align: left;
                white-space: nowrap;
                line-height: 20px;
                margin-top: 1px;
            }
        }

        .box_10 {
            width: 326px;
            margin: 20px 16px 0 0;

            .image-text_14 {
                width: 120px;

                .thumbnail_12 {
                    width: 16px;
                    height: 16px;
                    margin: 3px 0 3px 0;
                }

                .text-group_7 {
                    overflow-wrap: break-word;
                    color: rgba(52, 49, 79, 1);
                    font-size: 16px;
                    font-family: PingFangSC-Medium;
                    font-weight: 500;
                    text-align: left;
                    white-space: nowrap;
                    line-height: 22px;
                }
            }

            .text_26 {
                overflow-wrap: break-word;
                color: rgba(52, 49, 79, 1);
                font-size: 14px;
                font-weight: normal;
                text-align: left;
                white-space: nowrap;
                line-height: 20px;
                margin-top: 1px;
            }
        }
    }
}
</style>